<template>  
    <div class="commodity">
        <div class="block" >
            <el-carousel height="470px">
            <el-carousel-item v-for="( item , i ) in commodit.pictures" :key="i" class="el-carousel-item">
                <img :src="item" alt="" class="picturesSize" width="100%" height="100%">
            </el-carousel-item>
            </el-carousel>
        </div>
        <goods-shop :itemInfo="commodit.itemInfo" />
        <shop       :shop="commodit.iShop" />
        <goods-info ref="goodsinfo" :detailInfo="commodit.detailInfo"/>
        <param-info ref="paraminfo" :paramInfo="commodit.paramInfo"/>
        <comment-info ref="commentinfo" :commentInfo="commodit.commentInfo"/>
    </div>
</template>



<script>
    import goodsShop from "views/detail/views/commodity/itemInfo"
    import Shop from "views/detail/views/commodity/shop"
    import goodsInfo from "views/detail/views/commodity/goodsInfo"
    import paramInfo from "views/detail/views/commodity/param"
    import commentInfo from "views/detail/views/commodity/commentInfo"

    export default {
        name:"commodity",
        components:{
            goodsShop,
            Shop,
            goodsInfo ,
            paramInfo,
            commentInfo
        },
        created(){

        },
        props:{
            commodit :{
                type :Object,
                default() {
                    return {}
                }
            }
        },methods:{
        },mounted(){
        }
  }
</script>

<style>
/* 录播图样式 */
.block {
    width: 100%;
}
.el-carousel__button {
    width: 10px;
    height: 10px;

    background-color: orange;
}

</style>